<template>
	<view class="count_down" :style="{color: color,fontSize: fontSize+'rpx', padding: padding}">
		<text>{{minutes1}}</text>
		<text>{{minutes}}</text>
		<text>:</text>
		<text>{{second1}}</text>
		<text>{{second}}</text>
	</view>
</template>

<script>
	export default {
		name:"timer",
		props:{
			auto:{
				type:Boolean,
				default:true
			},
			color: {
				type: String,
				default: '#000'
			},
			fontSize: {
				type: String,
				default: '30'
			},
			padding: {
				type: String,
				default: '30rpx 0'
			},
			defaultSecond: {
				type: Number,
				default: 0
			}
		},
		watch:{
			Number:function(val){
				this.countDown1=this.Number
				this.countDown(this.Number)
				this.$emit('timing',this.Number)
			}
		},
		created(){
			if(this.auto){
				this.interval=setInterval(()=>{
					this.Number++
				},1000)
			}
			if(this.defaultSecond > 0){
				this.countDown(this.defaultSecond)
			}
		},
		data() {
			return {
				Number:0,
				minutes:0,
				minutes1:0,
				second:0,
				second1:0,
				countDown1:0,
				interval:null
			};
		},
		methods:{
			reset(){
				clearInterval(this.interval)
				this.Number=0
				this.minutes=0
				this.minutes1=0
				this.second=0
				this.second1=0
				this.countDown1=0
				this.interval=setInterval(()=>{
					this.Number++
				},1000)
			},
			start(){
				this.interval=setInterval(()=>{
					this.Number++
				},1000)
			},
			clear(){
				clearInterval(this.interval)
			},
			countDown(countDown){
				if(countDown>59){
					let d = parseInt(countDown/60)
					let minute = d.toString().split('')
					if(minute.length==1){
						this.minutes=minute[0]
						this.minutes1=0
					}else{
						this.minutes1=minute[0]
						this.minutes=minute[1]
					}
					
					let dd = countDown%60
					let numbers = dd.toString().split('')
					if(numbers.length==1){
						this.second1=0
						this.second=numbers[0]
					}else{
						this.second1=numbers[0]
						this.second=numbers[1]
					}
				}else{
					this.minutes=0
					this.minutes1=0
					let numbers = countDown.toString().split('')
					if(numbers.length==1){
						this.second=numbers[0]
						this.second1=0
					}else{
						this.second1=numbers[0]
						this.second=numbers[1]
					}
					
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
.count_down{
	display: flex;
	align-items: center;
	justify-content: center;
	text{
		display: block;
		margin-right: 6rpx;
		font-weight: bold;
	}
}
</style>
